<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<title>Comet Chat</title>
		<script type="text/javascript" src="/static/jquery-1.2.6.min.js"></script>
		<script type="text/javascript">
			function update_msgs(){
				$.get('{% url update %}', function(data){
					$('#messages').append( data )
					update_msgs()
				});
			}
			$(function(){
				$("#post_msg").click(function(){
					jQuery.getJSON('{% url write %}', $('#comment_form').serialize()) 
				})
				update_msgs()
			})
		</script>
		<style type="text/css">
		    body{
		        font-family: sans-serif;
		    }
		    .date{
		        color: #777;
		        font-size: 12px;
		    }
		</style>
	</head>
	<body>
		<p>Here be messages:</p>
		<ul id="messages">
		</ul>
		<p>Here be form:</p>
		<form id="comment_form">
			{{ form.text }}
			<input id="post_msg" type="button" value="post" />
		</form>
	</body>
</html>
